@import "../mixins";
@import "color";

//reset/from mui样式
.checkbox {
    min-width: .3rem;
    min-height: .4rem;

    &::before {
        content: '\e411';
        border-radius: 0;
        padding: .05rem;
        font-family: Muiicons;
        font-size: .22rem;
        font-weight: 400;
        line-height: 1;
        text-decoration: none;
        color: #aaa;
        background: 0 0;
        -webkit-font-smoothing: antialiased;
    }

    &.active::before {
        content: '\e442';
        color: $blue;
    }
}

.mui-btn {
    padding: 0 .12rem;
}

.mui-icon-trash {
    font-size: .22rem;
}

.mui-table-view:after {
    content: none;
}

.mui-table-view-cell:last-child:after {
    height: 1px;
}

.mui-icon-trash {
    padding: 0 .1rem; //增加体积,利于点击
}

.sale-price {
    display: inline-block;
    font-size: .17rem;
    color: $red !important;
}

.origin-price {
    position: relative;
    left: .05rem;
    display: inline-block;
    font-size: .12rem;
    color: #787878 !important;
    opacity: .8;

    &::after {
        content: '';
        position: absolute;
        top: 50%;
        left: .02rem;
        display: block;
        width: 100%;
        border-top: 1px solid #787878;
    }
}

//商品样式, 以后记得不要随便叫item,公共样式最好加前缀
.item {
    padding: .1rem;
    background-color: #fff;


    .img {
        width: .65rem;
        height: .65rem;
        margin-right: .085rem;
    }

    .info {
        width: 1.9rem;
    }

    .name {
        @include text-dot(1);
        width: 100%;
        margin-bottom: .15rem;
        font-size: .15rem;
        line-height: normal;
    }

    .price {
        -webkit-box-align: end;
        -webkit-align-items: flex-end;
    }

    .sale-price {
        font-size: .15rem;
    }

    .origin-price {
        margin-right: .06rem;
    }

    .item-count {
        color: $text-gray;
    }
}

.item-box,
.item,
.text,
.price {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
}
//商品样式 end

//作为标题的单行
.row {
    position: relative;
    min-height: .4rem;
    margin: 0;
    padding: 0 .1rem;
    font-size: .15rem;
    line-height: .4rem;
    color: #3b3b3b;
    background-color: #fff;

    &.mui-navigate-right::after,
    .mui-navigate-right::after {
        font-size: .2rem;
    }

    .mui-icon-plusempty:before {
        position: relative;
        top: .02rem;
        font-size: .28rem;
        font-weight: 600;
    }

}

//详情里的行, height 较低, order.scss里有一份一样的代码,还未重构
.detail {
    padding: .1rem 0;
    background-color: white;

    .row {
        min-height: .25rem;
        line-height: .25rem;

        &:not(:last-child) {
            > span {
                display: inline-block;
                overflow: hidden;
            }
        }

        .text-gray.text-dot {
            width: 2.5rem;
        }
    }

    .text-gray {
        padding-left: .05rem;
        margin-right: .2rem;
        font-weight: 300;
        color: $text-gray;
    }
}


